<template>
  <main class="efficiency-page">
    <card-wrapper>
      <c-card slot="left" title="住院总费用趋势" :clickMore="clickMore" :height="310">
        <c-bar-date :barData="sumCostTrend" v-if="sumCostTrend.xAxis.length"/>
      </c-card>
      <c-card slot="right" title="住院费用变化动因分析" :clickMore="clickMore" :height="310">
        <c-bar-title-crosswise :title="`住院总费用同比变化额：${changeChartTitle.sum}万元 | 同比：${changeChartTitle.rate}`"
                               :bar-data="changeChartData"
                               v-if="changeChartData.yAxis.length"/>
      </c-card>
    </card-wrapper>
    <card-wrapper>
      <c-card slot="left" title="住院均次总费用趋势" :clickMore="clickMore" :height="310">
        <c-line-trend yAxisName="万元" :lineData="avgCostTrend" :titleConfig="avgCostTrendTitle"
                      v-if="avgCostTrend.xAxis.length"/>
        <div class="no-data" v-else>暂无数据</div>
      </c-card>
      <c-card slot="right" title="次均费用需下调幅度最大的科室TOP5" :clickMore="clickMore" :height="310">
        <c-table-mini :columns="avgDownDepartmentColumns" :table-data="avgDownDepartmentTableData"/>
      </c-card>
    </card-wrapper>
    <card-wrapper>
      <c-card slot="left" title="平均住院日趋势" :clickMore="clickMore" :height="300">
        <c-line-trend yAxisName="天" :lineData="avgDataHospital" :titleConfig="avgDataHospitalTitle"
                      v-if="avgDataHospital.xAxis.length"/>
        <div class="no-data" v-else>暂无数据</div>
      </c-card>
      <c-card slot="right" title="平均住院日需下调幅度最大的科室TOP5" :clickMore="clickMore" :height="300">
        <c-table-mini :columns="downDepartmentColumns" :table-data="downDepartmentTableData"/>
      </c-card>
    </card-wrapper>
    <card-wrapper>
      <c-card slot="left" title="科室综合排名" :clickMore="clickMore" :height="300">
        <c-rank/>
      </c-card>
      <c-card slot="right" title="科室排名TOP5" :clickMore="clickMore" :height="300">
        <c-table-mini :columns="rankingColumns" :table-data="rankingTableData"/>
      </c-card>
    </card-wrapper>
  </main>
</template>

<script lang="js">
import cBarDate from "@/components/cBarDate.vue";
import cBarTitle from "@/components/cBarTitle.vue";
import cBarTitleCrosswise from "@/components/cBarTitleCrosswise.vue";
import cLineTrend from "@/components/cLineTrend.vue";
import cTableMini from "@/components/cTableMini.vue";
import cRank from "../cRank.vue";
import {calcBasis, calcBasisIncrease} from "@/utils/transform"
import {
  selectMoneyTrendChart,
  selectMoneyTrendAverageChart,
  selectAverageInTheHospitalChart,
  selectDaysNeedDownDepartment,
  selectDepartmentSurplusListRanking,
  selectChangeAgentInHospitalChart,
  selectAvgFeeNeedDownDepartmentTop5
} from '@/api/drgsGroupResults';

export default {
  components: {
    cBarDate, cBarTitle, cLineTrend, cTableMini, cRank, cBarTitleCrosswise
  },
  props: {
    timeParams: {
      type: Object
    }
  },
  watch: {
    timeParams() {
      this.reGetData();
    }
  },
  data() {
    return {
      sumCostTrend: {
        xAxis: [],
        dataList: [],
      },
      avgCostTrend: {
        xAxis: [],
        ave_areamoneyList: [],
        ave_moneyList: [],
      },
      avgCostTrendTitle: [
        {name: '次均费用', key: "ave_moneyList"},
        {name: '目标病例次均费用', key: "ave_areamoneyList"},
        {name: '均次费用可下调金额', key: "difference"},
      ],
      avgDataHospital: {
        xAxis: [],
        ave_areadaysList: [],
        ave_daysList: [],
      },
      avgDataHospitalTitle: [
        {name: '平均在住院日', key: "ave_daysList"},
        {name: '目标平均住院日', key: "ave_areadaysList"},
        {name: '平均住院日可下调数', key: "difference"},
      ],
      downDepartmentColumns: [
        {title: "科室名称", dataIndex: 'dep_name'},
        {title: "科室编码", dataIndex: 'dep_code'},
        {title: "平均住院日", dataIndex: 'days'},
        {title: "病例数", dataIndex: 'count'},
        {title: "可下调比例", dataIndex: 'xiatiaobilv', customRender: (text) => `${text.toFixed(2)}%`},
        {title: "目标平均住院日", dataIndex: 'areaDays'},
      ],
      downDepartmentTableData: [],
      rankingColumns: [
        {title: '科室名称', dataIndex: "dep_name"},
        {title: '科室编码', dataIndex: "dep_code"},
        {title: '结余的钱数', dataIndex: "jieyu"},
        {title: '当前月份的排名', dataIndex: "rankNo"},
        {title: '上个月的排名', dataIndex: "oldRank"},
        {title: '去年同月的排名', dataIndex: "lastRank"}
      ],
      rankingTableData: [],
      avgDownDepartmentColumns: [
        {title: '科室名称', dataIndex: "dep_name"},
        {title: '科室编码', dataIndex: "dep_code"},
        {title: '次均费用', dataIndex: "avemoney"},
        {title: '总费用', dataIndex: "allmoney"},
        {title: '下调比率', dataIndex: "xiatiaobilv", customRender: (text) => `${text.toFixed(2)}%`}
      ],
      avgDownDepartmentTableData: [],
      changeChartData: {
        yAxis: [],
        dataList: []
      },
      changeChartTitle: {
        sum: "",
        rate: ""
      }
    }
  },
  created() {
    this.reGetData();
  },
  methods: {
    clickMore() {

    },
    reGetData() {
      this.getSelectMoneyTrendChart();
      this.getSelectMoneyTrendAverageChart();
      this.getSelectAverageInTheHospitalChart();
      this.getSelectDaysNeedDownDepartment();
      this.getSelectDepartmentSurplusListRanking();
      this.getSelectChangeAgentInHospitalChart();
      this.getSelectAvgFeeNeedDownDepartmentTop5();
    },
    async getSelectMoneyTrendChart() {
      const params = {...this.timeParams};
      this.sumCostTrend.xAxis = []
      const res = await selectMoneyTrendChart(params);
      this.sumCostTrend.xAxis = res['data'].map(item => item['datatime']).reverse();
      this.sumCostTrend.dataList = res['data'].map(item => item['count']).reverse();
    },
    async getSelectMoneyTrendAverageChart() {
      const params = {
        ...this.timeParams
      }
      this.avgCostTrend.xAxis = [];
      const res = await selectMoneyTrendAverageChart(params);
      this.avgCostTrend.xAxis = res['data'].map(item => item['months'])
      this.avgCostTrend.ave_areamoneyList = res['data'].map(item => item['ave_areamoney'])
      this.avgCostTrend.ave_moneyList = res['data'].map(item => item['ave_money'])
    },
    async getSelectAverageInTheHospitalChart() {
      const params = {
        ...this.timeParams
      }
      this.avgDataHospital.xAxis = []
      const res = await selectAverageInTheHospitalChart(params)
      this.avgDataHospital.xAxis = res['data'].map(item => item['months'])
      this.avgDataHospital.ave_areadaysList = res['data'].map(item => item['ave_areadays'])
      this.avgDataHospital.ave_daysList = res['data'].map(item => item['ave_days'])
    },
    async getSelectDaysNeedDownDepartment() {
      const params = {
        ...this.timeParams,
        limitNum: 5
      }
      const res = await selectDaysNeedDownDepartment(params)
      if (res['data']) {
        this.downDepartmentTableData = res['data']
      }
    },
    async getSelectDepartmentSurplusListRanking() {
      const params = {
        ...this.timeParams,
        limitNum: 5
      }
      const res = await selectDepartmentSurplusListRanking(params);
      if (res['data']['data']) {
        this.rankingTableData = res['data']['data'].splice(0, 5);
      } else {
        this.rankingTableData = [];
      }
    },
    async getSelectChangeAgentInHospitalChart() {
      const params = {
        ...this.timeParams
      }
      this.changeChartData.yAxis = [];
      const res = await selectChangeAgentInHospitalChart(params);
      if (res['data']['nowMap'] !== null) {
        if(res['data']['oldMap']===null){
          res['data']['oldMap'] = {
            OutCount:0,
            avemoney:0,
            allmoney:0,
          }
        }
        this.changeChartData.yAxis = ['出院人次动因', '次均费用动因'];
        this.changeChartData.dataList = [
          calcBasis(res['data']['nowMap']['OutCount'], res['data']['oldMap']['OutCount']),
          calcBasis(res['data']['nowMap']['avemoney'], res['data']['oldMap']['avemoney']),
        ];
        this.changeChartTitle.sum = res['data']['nowMap']['allmoney'] - res['data']['oldMap']['allmoney'];
        this.changeChartTitle.rate = calcBasisIncrease(res['data']['nowMap']['allmoney'], res['data']['oldMap']['allmoney']);
      } else {
        this.changeChartData.yAxis = [];
      }
    },
    async getSelectAvgFeeNeedDownDepartmentTop5() {
      const params = {
        ...this.timeParams,
        limitNum: 5
      }
      const res = await selectAvgFeeNeedDownDepartmentTop5(params);
      this.avgDownDepartmentTableData = res['data'];
    }
  }
}
</script>

<style scoped lang="stylus">
.no-data{
  text-align center
  font-size 12px
}
</style>
